<!DOCTYPE html>
<html>

	<head lang="en">
		<title>首页</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css">
		<script src="/js/jquery/jquery.min.js"></script>
		<script src="/js/bootstrap/js/bootstrap.min.js"></script>
		<link rel="stylesheet" href="/css/font/css/font-awesome.min.css" />
		<link rel="stylesheet" href="/css/reset.css" />
		<link rel="stylesheet" href="/css/strategyDetails.css" />
		<script src="/js/plugins/jrender/jrender.min.js"></script>
		<script src="/js/common.js"></script>
		<link rel="stylesheet" href="js/plugins/dialog2/dialog.css">
		<script src="js/plugins/dialog2/dialog.min.js"></script>
		<script>


			$(function () {
			    var params=getParams();
				$.get("/strategies/details/"+params.id,function (data) {
                    console.log(data);
                    $(".detail").renderValues({list:data})
                })
            })
		</script>
	</head>

	<body>

	<div class=" nav-search">
		<a href="javascript:history.go(-1);">
			<span><i class="fa fa-chevron-left"></i></span>
		</a>
	</div>
	<hr>

	<div class="container detail">
		<div>
			<h4 class="title"><strong render-html="list.title" ></strong></h4>
			<img class="head-img" render-src="list.coverUrl">
			<div class="author">By <span ></span></div>
			<div class="content" render-html="list.strategyContent.content">
			</div>
		</div>
		<div class="container d-flex">
			<div class="p-2  flex-fill">
				<i class="fa fa-thumbs-o-up"  id="likeBtn"> </i>
			</div>
			<div class="p-2  flex-fill"><i class="fa  fa-commenting-o" id="commentBtn"> </i>
			</div>
			<div class="p-2  flex-fill"><i class="fa fa-star-o" id="collectBtn"> </i>
			</div>
		</div>
	</div>
	<HR style="FILTER: progid:DXImageTransform.Microsoft.Shadow(color:#987cb9,direction:145,strength:15)" width="80%"
		color=#987cb9 SIZE=1>

	<div class="tab-content " id="pills-tabContent">
		<div id="comment">
			<div render-loop="list">
				<div class="container row comment">
					<div class="col-2 comment-head">
						<img class="rounded-circle"
							 render-src="list.user.headImgUrl" width="35px" height="35px">
					</div>
					<div class="col comment-right">
						<p class="authorName"><span render-html="list.user.nickName">dafei</span></p>
						<span class="comment-date" render-html="list.createTime">2018-07-19</span>
						<div class="comment-content">
							<a role="button">
								<p render-html="list.content">很好我觉得很好我觉得很好我觉得很好</p>
							</a>
						</div>
					</div>
					--------------------------------------->
				</div>
			</div>
		</div>
	</div>
	</body>
	<!--begin..................................................................-->
	<script>
        $(function () {
            var collect = 0;
            var user = sessionStorage.getItem("user");
            //点击收藏
            $("#collectBtn").click(function () {
                if (user) {
                    if (collect == 0) {
                        $("#collectBtn").css({"color": "red"});
                        collect = 1;
                        $.post("/collect", {strategyId: getParams().id});
                    } else if (collect == 1) {
                        $("#collectBtn").attr("style", "");
                        collect = 0;
                        $.post("/collect", {strategyId: getParams().id});
                    }
                } else {
                    location.href = "/login.html";
                }
            });

            if(user){
                //发送请求进行收藏回显
                $.get("/collect/select", {strategyId: getParams().id}, function (data) {
                    if (data.success) {
                        $("#collectBtn").css({"color": "red"});
                        collect=1;
                    } else {
                        $("#collectBtn").attr("style", "");
                    }
                })
            }
        })

        //begin...........................
        //点赞
        var praise = 0;
        $("#likeBtn").click(function () {
            if (praise == 0) {
                $("#likeBtn").css({"color": "red"});
                praise = 1;
            } else if (praise == 1) {
                $("#likeBtn").attr("style", "");
                praise = 0;
            }
        });
        //end...........................
	</script>
	<!--end........................................................................-->

	<!--begin................................................................-->
	<script>
        $(function () {
            //回显评论
            $.get("/collect/listComment",{detailId:getParams().id},function (date) {
                $("#comment").renderValues({list:date});
            });
            //发表评论
            $("#commentBtn").click(function () {
                if(sessionStorage.getItem("user")){
                    location.href="/mine/collectComment.html?detailId="+getParams().id;
                }else {
                    $(document).dialog({
                        type: 'notice',
                        infoText: '请先登录',
                        autoClose: 2000,
                        position: 'bottom'  // center: 居中; bottom: 底部
                    });
                }
            });
        })
	</script>
	<!--end........................................................................-->
</html>